import { useField } from 'useField';

const SomeComponent = {
  template: `
    <input v-model="value" type="text">
    <span>{{ errorMessage }}</span>
  `,
  setup() {
    const { value, errorMessage } = useField('name', (value) => {
      return value ? true : 'field is required';
    });
    return {
      value,
      errorMessage,
    };
  },
};
test('it validates', async () => {
  // assuming you have a mounting helper
  mount(SomeComponent);
  const input = document.querySelector('input');
  input.value = '';
  input.dispatchEvent(new Event('change'));
  // ❌ Fails
  expect(document.querySelector('span').textContent).toBe('Field is required');
});
